<template>
<view class="main">
  <nav-bar title="创建企业" />
  <view class="title pl-13">企业名称（全称）</view>
  <view class="flex_b_c cont">
    <input type="text" @input="onInput" placeholder-class="inputPlaceHolder" class="flex1 name" v-model="entName" placeholder="请输入公司全称需与营业执照一致">
    <view class="suffix">{{ entName.length }}/46</view>
    <view v-if="selectList.length" class="select">
      <view class="select_list" v-for="item in selectList" :key="item.id" @click="onChooseEnt(item)">{{ item.entName }}</view>
    </view>
    <!-- wx5d4b6e6ecc2a57a8 -->
  </view>
  <view class="txt">注意事项</view>
  <view class="desc">
    1.请输入您所属公司营业执照上的公司名称 \n
    2.请注意区分总公司和分公司 \n
    3.公司名称将用于后续企业认证使用，请确保准确性 
  </view>
  <view class="flex_center h_145 footer_fixed ">
    <view :class="['w_650 btns confirm', !entName && 'primary']" @click="onSubmit">{{ allList.findIndex(item => item.entName === entName) > -1 ? '立即加入' : '下一步' }}</view>
    <!-- <view class="w_650 btns confirm" @click="onSubmit">立即加入</view> -->
  </view>
</view>
<van-dialog id="van-dialog" cancel-button-color="#999999" confirm-button-color="#00B277" />
</template>
<script setup>
import { ref, onBeforeMount } from 'vue'
import { postFindCompany, postJoinCompany, getFindAllCompany } from '@/api/center'
import Dialog from '/wxcomponents/vant/dialog/dialog.js';
import storage from '@/utils/storage'
let entName = ref('')
let allList = ref([])
let selectList = ref([])
let onInput = async (e) => {
  console.log(e)
  selectList.value = []
  selectList.value = allList.value.filter(({ entName }) => {
    console.log(entName.includes(e.detail.value))
    return e.detail.value && entName.includes(e.detail.value)
  })
  console.log(selectList.value)
}
onBeforeMount(async () => {
  const { code, data } = await getFindAllCompany()
  if (code === 200) {
    allList.value = data
  }
})
let onChooseEnt = item => {
  entName.value = item.entName
  selectList.value = []
}
// 加入公司
let onAddCompany = async id => {
  const { code, data } = await postJoinCompany({ id })
  if (code === 200) {
    uni.showToast({title: '加入成功', icon: 'none' })
    let info = storage.getStorage('info')
    storage.setStorage('info', { ...info, entId: id, entName: entName.value})
    uni.switchTo({
      url: '/pages/center/index'
    })
  }
}
let onSubmit = async () => {
  if (!entName.value) {
    uni.showToast({ title: '请输入企业名称', icon: 'none' })
    return false
  }
  let isHasEnt = allList.value.find(item => item.entName === entName.value)
  if (Object.keys(isHasEnt).length) {
    createOpt(isHasEnt.authFlag, isHasEnt.id)
    return false
  }
  // "createFlag":  //1.可以创建 不存在公司   2.不能创建 公司存在并且通过审核 只能加入 3.不能创建 该公司待审核中
  const { code, data } = await postFindCompany({ entName: entName.value })
  if (code === 200) {
    if (data.createFlag === 1) {
      uni.navigateTo({
        url: '/pages/center/infomation/company?entName=' + entName.value
      })
    }
    createOpt(data.authFlag, data.entId)
  }
  
}
let createOpt = (flag, id) => {
  console.log(flag)
  if (flag === 2) {
    Dialog.confirm({
      title: '温馨提示',
      closeOnClickOverlay: true,
      showCancelButton: false,
      confirmButtonColor: '#00B277',
      confirmButtonText: '立即加入',
      message: '该公司已创建，可直接加入 ',
    })
    .then((e) => {
      onAddCompany(id)
    }).catch(e => {});
  } else if (flag === 3) {
    Dialog.confirm({
      title: '温馨提示',
      closeOnClickOverlay: true,
      showCancelButton: false,
      confirmButtonColor: '#00B277',
      confirmButtonText: '我知道了',
      message: '该公司已被创建，正在审核中，请耐心等待，待审核通过后可直接加入，如有疑问可直接联系平台客服 010-88857706 ',
    })
    .then((e) => {
    }).catch(e => {});
  }
}
</script>
<style lang="scss" scoped>
.main {
  background: #fff;
  min-height: 100vh;
  padding: 34rpx 20rpx 0 20rpx;
}
.title {
  font-weight: 500;
  font-size: 32rpx;
  color: #333333;
  line-height: 64rpx;
}
.cont {
  padding-bottom: 25rpx;
  padding-left: 13rpx;
  padding-right: 4rpx;
  border-bottom: 2rpx solid #F4F7FC;
  position: relative;
  .name {
    line-height: 58rpx;
    color: #333;
  }
  .suffix {
    font-weight: 500;
    font-size: 28rpx;
    color: #999999;
    line-height: 58rpx;
  }
}
.txt {
  padding-top: 30rpx;
  padding-left: 12rpx;
  font-weight: 500;
  line-height: 63rpx;
  font-size: 28rpx;
  color: #000000;
}
.desc {
  padding-left: 12rpx;
  white-space: pre-line;
  font-weight: 500;
  font-size: 26rpx;
  color: #999999;
  line-height: 50rpx;
}
.w_650 {
  width: 650rpx;
}
.select {
  color: #666;
  font-size: 28rpx;
  position: absolute;
  max-height: 600rpx;
  overflow: auto;
  width: 100%;
  background: #fff;
  /* inset 放在前后都可以 */
  box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, .05) ;
  top: 84rpx;
  left: 0;
  .select_list {
    padding: 20rpx 30rpx;
    line-height: 38rpx;
    // border-bottom: 2rpx solid #f2f2f2;
  }
}
</style>